<template>
	<view :class="currentTheme">
		<a-nabbar name="新增剧本" />
		<mescroll-body  @init="mescrollInit"  @down="downCallback"  @up="upCallback" :up="upOption" @emptyclick="feedBack">
			<view class=" u-padding-left-32 u-padding-right-32">
				<view class="u-padding-top-32">
					<item-search placeholder="搜索发行或剧本" @change="downCallback" v-model="form.name"></item-search>
				</view>
				<view  v-for="(item,index) in dataList" :key="index" class="u-margin-top-20">
					<list-item :item="item" :isShare="false" :showTime="false"  height="277"
          width="171" :showFooterRight="false">
					<!-- 	<view slot="content">
							<view class="u-font-22 desc line-clamp text-color-fbfbfb u-margin-top-24">{{item.info}}</view>
						</view> -->
						<view class="u-flex u-row-right u-margin-top-26" slot="footer-end" >
							<view>
								<item-btn @click="addLarp(item)" width="200" height="64"><text class="u-font-20">添加到【我的剧本】</text></item-btn>
							</view>
						</view>
					</list-item>
				</view>
			</view>
		</mescroll-body>
		<model v-model="modelFlag" :show-title="false" show-cancel-button   cancel-color="#333333" :confirm-color="currentThemeObj.primary" @confirm="confirm" content="剧本库中没有搜索到剧本或发行，立即反馈？" />
	</view>
</template>

<script>
	import upCallback from '@/mixins/upCallbackMixin.js'
	import model from '@/components/u-modal/u-modal.vue'
	import itemSearch from '@/components/itemSearch/itemSearch.vue'
	export default {
		mixins:[upCallback],
		data() {
			return {
				dataList:[],
				form:{name:'',types:'script'},
				upOption:{
					empty:{
						tip:'没有找到想要的剧本/发行？',
						btnText :'去反馈'
					}
				},
				apiType:"product",
				apiModule:'shopApi',
				name:'getProductsLib',
				modelFlag:false,
				customStyle:{
					backgroundColor:'#765CFE',
					borderColor:'none'
				},
				option:{
					name:''
				},
				timer:null
			}
		},
		components: {
			model,itemSearch
		},
		onLoad(option) {
			this.option = option;
			this.form.storeId = this.loginForm.storeId;
		},
		methods: {
			//点击反馈
			feedBack(){
        // this.$u.toast('敬请期待');
				this.$u.route({
					url:'/pagesA/storeAddLarp/feedbackLarp'
				})
				this.form.name = ''
			},
			addLarp(item) {
				uni.setStorageSync('backStorage','true')
				this.$u.route({
					url:'/pagesA/storeAddLarp/addLarp',
					params:{
						id:item.id,
						name:item.name
					}
				})
			}
		},
		filters: {
			storeProductsFilter(list) {
				return list.map(val=>`《${val.name}》`).join(' ');
			}
		}
	}
</script>
<style scoped lang="scss">
	.store-larp-list{
		line-height: 30rpx;
	}
	.footer-btn{
		text-align: center;
		color: white;
		font-size: 20rpx;
		border-radius: 50rpx;
		background: #765CFE;
		line-height: 55rpx;
		display: inline-block;
		padding: 0 25rpx;
	}
</style>
